/**
 * 1、什么是ReactDOM
 * ReactDOM:用来操作浏览器的库文件，它的主要作用是用来将组件渲染到页面上，特别注意：它操作的不是真实DOM，它操作的是虚拟DOM
 * 2、ReactDOM的使用步骤
 * 第1步：导入ReactDOM对象
 * import ReactDOM from 'react-dom/client'
 * 第2步：创建虚拟DOM：在React中创建虚拟DOM的方式有两种，1）JSX 2）通过React.createElement()来创建虚拟DOM
 * createElement(参数1，参数2，参数3)
 * 参数1：标签的名称
 * 参数2：标签中的属性
 * 参数3：子元素
 * 第3步：要将虚拟DOM进行渲染
 * const root=ReactDOM.createRoot(目标渲染的DOM元素)
 * root.render(虚拟DOM)
 */
import ReactDOM from 'react-dom/client'
import React from 'react'
//通过React.createElement方法来创建虚拟DOM
// const vNode=React.createElement("h1",null,"Hello React!");
const vLiNode1=React.createElement("li",{style:{color:'red'},key:0},"苹果");
const vLiNode2=React.createElement("li",{key:1},"橘子");
const list=[]
list.push(vLiNode1)
list.push(vLiNode2)
const vUlNode=React.createElement("ul",null,list)
const root=ReactDOM.createRoot(document.getElementById("root"))
//渲染虚拟DOM到目标挂载点上
root.render(vUlNode)

